﻿/// <reference path="jquery-2.0.3.js" />
/// <reference path="htmlFragments.js" />
/// <reference path="class.js" />
var HoodNews = HoodNews || {};

HoodNews.ui = (function () {
    var ui = Class.create({
        init: function (selector) {
            this.selector = selector;
            this.$container = $(selector);
            this.htmlFragments = htmlFragments;
            this.openGameDialogId;
            this.startGameButtonId;
            this.createGameShown = false;
        },
        loadLogin: function () {
            var html = this.htmlFragments.login();
            this.$container.html(html);

            this.$container.find("#login-tabs").tabs();
        },
        loadMainScreen: function (nickname, articles, activeArticle) {
            this.$container.html("");
            this.loadNavigationTab(nickname);
            this.loadMain(articles, activeArticle);
            this.loadNotificationTab();
        },
        loadMyMainScreen: function (nickname, myArticles, myActiveArticle) {
            this.$container.html("");
            this.loadNavigationTab(nickname);
            this.loadMyMain(myArticles, myActiveArticle);
            this.loadNotificationTab();
        },
        loadNavigationTab: function (nickname) {
            var navTab = this.htmlFragments.navigationTab(nickname);
            this.$container.append(navTab);
        },
        loadMain: function (articles, activeArticle) {
            var articlesHtml = this.htmlFragments.articlesTabFrame(articles);
            this.$container.append(articlesHtml);
            var activeArticleHtml = this.htmlFragments.activeArticleFrame(activeArticle);
            this.$container.append(activeArticleHtml);
        },
        loadMyMain: function (myArticles, myActiveArticle) {
            var articlesHtml = this.htmlFragments.myArticlesTabFrame(myArticles);
            this.$container.append(articlesHtml);
            var activeArticleHtml = this.htmlFragments.myActiveArticleFrame(myActiveArticle);
            this.$container.append(activeArticleHtml);
        },
        loadActiveArticleTab: function (activeArticle) {
            var activeArticleHtml = htmlFragments.activeArticleFrame(activeArticle);
            $("#activeArticle").html(activeArticleHtml);
        },
        loadMyActiveArticleTab: function (myActiveArticle) {
            var activeArticleHtml = htmlFragments.myActiveArticleFrame(myActiveArticle);
            $("#myActiveArticle").html(activeArticleHtml);
        },
        loadArticlesTab: function (articles) {
            var articlesHtml = htmlFragments.articlesTabFrame(articles);
            $("#articles").html(articlesHtml);
        },

        loadMyArticlesTab: function (articles) {
            var articlesHtml = htmlFragments.myArticlesTabFrame(articles);
            $("#myArticles").html(articlesHtml);
        },
        loadNotificationTab: function () {
            var notificationTabHtml = this.htmlFragments.notificationTab();
            this.$container.append(notificationTabHtml);
        },
    });

    return {
        getUi: function (selector) {
            return new ui(selector);
        }
    }
}());